<!--
    本周认证主播
 --->
<template>
    <div style="width:100%;height:100%;" id="this-week-news-live-dom"></div>
</template>


<script>
    const echarts = require('echarts');
    export default {
        name: 'thisWeekNewsLive',
        data () {
            return {
                arry:[]
            };
        },
        created () {
            this.getData();
        },
        methods: {
            getData(){
                let self=this;
                self.$axios.get('/anchor/newnum').then((res) => {
                    self.arry  = res.data.data;
                    self.$nextTick(() => {
                        let newsLiveChart = echarts.init(document.getElementById('this-week-news-live-dom'));
                        const option = {
                            color: ['#3398DB'],

                            toolbox: {
                                show: true,
                                feature: {
                                    restore: {},
                                    saveAsImage: {}
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            grid: {
                                left: '3%',
                                right: '4%',
                                bottom: '3%',
                                containLabel: true
                            },
                            xAxis: [
                                {
                                    type: 'category',
                                    data: [this.arry[0].date, this.arry[1].date, this.arry[2].date, this.arry[3].date, this.arry[4].date, this.arry[5].date, this.arry[6].date],
                                    axisTick: {
                                        alignWithLabel: true
                                    }
                                }
                            ],
                            yAxis: [
                                {
                                    type: 'value'
                                }
                            ],
                            //本周认证主播人数数据(宇)
                            series: [
                                {
                                    name: '新增实名主播',
                                    type: 'bar',
                                    data: [
                                        {value: this.arry[0].value, name:this.arry[0].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[1].value, name:this.arry[1].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[2].value, name:this.arry[2].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[3].value, name:this.arry[3].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[4].value, name:this.arry[4].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[5].value, name:this.arry[5].date, itemStyle: {normal: {color: '#2d8cf0'}}},
                                        {value: this.arry[6].value, name:this.arry[6].date, itemStyle: {normal: {color: '#2d8cf0'}}}
                                    ]
                                }
                            ]
                        };
                        newsLiveChart.setOption(option);

                        window.addEventListener('resize', function () {
                            newsLiveChart.resize();
                        });
                    });
                })

            },

        }
    };
</script>
